<template>
  <div class="p-4">
    <Card>
      <h1 class="text-2xl font-bold mb-4">满的足迹 - Calendar</h1>
      <el-calendar>
        <template #date-cell="{ data }">
          <div
            class="flex items-center justify-center w-full h-full cursor-pointer"
            @click="handleDateClick(data.day)"
          >
            {{ data.day.split('-').slice(2).join('-') }}
          </div>
        </template>
      </el-calendar>
    </Card>
  </div>
</template>

<script setup lang="ts">
import Card from '~/components/common/Card.vue';

definePageMeta({
  navTitle: '日历',
  order: 1,
});

const handleDateClick = (date: string) => {
  console.log('Clicked date:', date);
};
</script>